import Vue from 'vue'
import Vuex from 'vuex'
import common from "./modules/common"

Vue.use(Vuex)

export default new Vuex.Store({
    // state是用来存储所有数据的，一个对象存储所有的数据
    state:{
        count : 0
    },
    // getters是用来获取state中的数据的，可以对要获取的数据进行加功，然后返回，也不会影响数据的真实存储情况
    getters:{
        
    },
    // mutations是用来操作state中存储的数据的，是必须同步执行的函数
    mutations:{
        increment(state){
            state.count ++;
        }
    },
    // actions是可以调用mutation，然后可以执行异步函数
    actions:{
        increment(context){
            context.commit('increment')
            // 还有一种是dispatch，这个暂时还没有尝试
        }
    },
    /* modules是用来将store分成多模块的一个东西，在模块较多的时候，可以使用 modules，会更方便一点
        但是如果没那么多模块的话，就可以暂时不用。示例如下：
        const moduleA = {
            state: () => ({ ... }),
            mutations: { ... },
            actions: { ... },
            getters: { ... }
        }

        const moduleB = {
            state: () => ({ ... }),
            mutations: { ... },
            actions: { ... }
        }

        const store = new Vuex.Store({
            modules: {
                a: moduleA,
                b: moduleB
            }
        })

        store.state.a // -> moduleA 的状态
        store.state.b // -> moduleB 的状态*/
    modules:{
        common
    }

})